<template>
  <div class="articals">
    <div class="title">
      <div class="page-highlight">
        <h1><em>Sensors</em> — Open Access Journal</h1>
        <div style="padding-top: 5px;">
            <em>Sensors</em> (ISSN 1424-8220; CODEN: SENSC9)            is the leading international <a href="http://www.mdpi.com/editorial_process">peer-reviewed</a> open access journal on the science and technology of sensors and biosensors. <em>Sensors</em> is published monthly online by MDPI. &nbsp;&nbsp;
          <ul>
          <li><strong><span class="label"><a title="Open Access" href="../../about/openaccess">Open Access</a></span></strong>&nbsp;free for readers, with <a href="http://www.mdpi.com/journal/sensors/apc">article processing charges (APC)</a> paid by authors or their institutions.</li>
          <li><strong>High visibility:</strong> indexed by the <strong><a href="http://science.thomsonreuters.com/cgi-bin/jrnlst/jlresults.cgi?PC=MASTER&amp;Full=Sensors" target="_blank">Science Citation Index Expanded</a></strong> (Web of Science), <strong><a href="http://www.ncbi.nlm.nih.gov/pubmed?term=Sensors[journal]" target="_blank">MEDLINE</a></strong> (PubMed), <a href="http://www.engineeringvillage.com/" target="_blank"><strong><span style="color: #007f7f;">Ei&nbsp;Compendex</span></strong></a>, <a href="http://www.theiet.org/resources/inspec/" target="_blank"><strong><span style="color: #007f7f;">Inspec (IET)</span></strong></a> and other databases.</li>
          <li><strong>Rapid publication:&nbsp;</strong>manuscripts are peer-reviewed and a first decision provided to authors approximately 21 days after submission; acceptance to publication is undertaken in 4.76 days (median values for papers published in the first six months of 2018).</li>
          <li><strong>Recognition of Reviewers:</strong> reviewers who provide timely, thorough peer-review reports receive vouchers entitling them to a discount on the APC of their next publication in any MDPI journal, in appreciation of the work done.</li>
          <li><strong>Sections:</strong> published in 8 <a href="http://www.mdpi.com/journal/sensors/sections">topical sections</a>.</li>
          </ul>
        </div>
      </div>
    </div>
    <div class="menu">
      <h2>
      Journal Menu
      </h2>
      <ul>
        <li>Aims &amp; Scope</li>
        <li>Editorial Board</li>
        <li>Reviewer Board</li>
        <li>Reviewer Board</li>
        <li>Reviewer Board</li>
        <li>Reviewer Board</li>
        <li>Reviewer Board</li>
        <li>Reviewer Board</li>
        <li>Reviewer Board</li>
        <li>Reviewer Board</li>
      </ul>
    </div>
    <div class="content">
      <div class="generic-item article-item" v-for="item in 5" :key="item">
              <div class="article-icons">
                <span class="label openaccess">Open Access</span>
                <span class="label articletype">Review</span>
              </div>
              <div class="title-section">
                <a href="#" class="artical-title">Quantitative Scanning Laue Diffraction Microscopy: Application to the Study of 3D Printed Nickel-Based Superalloys</a>
              </div>
              <div class="artical-author">by
                <a href="#" class="author-link"><span class="author">Guangni Zhou</span></a>
                <a href="#" class="author-link"><span class="author">Yaodi</span></a>
                <a href="#" class="author-link"><span class="author">Li Ying</span></a>
              </div>
              <div class="summary-content">
                <div class="abstract-full inline">
                  Progress in computing speed and algorithm efficiency together with advances in area detector and X-ray optics technologies have transformed the technique of synchrotron radiation-based scanning Laue X-ray microdiffraction. It has now evolved into a near real-time quantitative imaging tool for material structure and deformation at the micrometer and nanometer scales. We will review the achievements of this technique at the Advanced Light Source (Berkeley, CA, USA), and demonstrate its application in the thorough microstructural investigations of laser-assisted 3D printed nickel-based superalloys.
                <a href="">Full article</a></div>
              </div>
            </div>
    </div>
  </div>
</template>
<script>
export default {
  mounted () {
    this.$http.get('/api/articlas/' + this.$route.params.id).then(function (rsp) {
      console.log(rsp)
    })
  }
}
</script>

<style lang="stylus" scoped>
main-color = #4f5671;
.title{
  border-top solid 2px main-color
  padding 8px 0 0 0;
  h1{
    font-size 20px;
    color main-color
  }
  .page-highlight{
    padding: 10px 15px 0 15px;
    // border-bottom: 2px solid #000;
    margin-top: -10px;
    margin-bottom: 10px;
    >div{
      font-family: Arial;
      font-size: 13px;
      line-height: 19px;
      ul{
        padding-left 25px
      }
      li{
        // list-style none
      }
    }
  }
}
.menu {
  >h2 {
    background-color: main-color;
    color: white;
    font-size: 18px;
    height: 35px;
    line-height: 35px;
    text-align: center;
  }

  ul {
    display: flex;
    text-decoration: none;
    list-style: none;
    flex-wrap: wrap;
    // overflow hidden
    padding: 0;
  }

  ul>li {
    cursor: pointer;
    font-size: 14px;
    // margin-right 5px
    padding: 0 3px;

    &:hover {
      color: main-color;
    }
  }

  ul>li::after {
    content: '|';
    color: #ddd;
    // right -3px
    margin-left: 8px;
    // position
  }
}
.generic-item {

    font-size: 12px;
    line-height: 19px;
    border-top: 1px solid #ededed;
    overflow: hidden;
    padding: 10px 15px;
}
.content .generic-item.article-item {
    padding: 15px;
    background-color: #f8f8f8;
    margin-bottom: 10px;
    -webkit-box-shadow: 1px 1px 3px 0 rgba(204,204,204,.75);
    -moz-box-shadow: 1px 1px 3px 0 rgba(204,204,204,.75);
    box-shadow: 1px 1px 3px 0 rgba(204,204,204,.75);
    margin-right: 15px;
    margin-left: 15px;
}
.summary-content{
  font-size: 14px;
  line-height: 19px;
  cursor: auto;
  font-style: normal;
  font-weight: 400
}
.author-link{
  color #a71a1a
}
.title-section{
  margin 8px 0
}
.title-section .artical-title{

  font-family: Helvetica,Arial;
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
  color #333333
}
.title-section a:hover{
  color #4f5671
}
.label {
    padding: 3px 6px;
    color white;
}
.openaccess {
    background-color: #4f5671;
}
.articletype, .label.review {
    background-color: #9F1326;
}
</style>
